<template>
    <div class="body-left">
        <div class="left-top">
            <el-button plain class="changePro">+更换项目</el-button>
        </div>
        <div>
          <el-tree
            :data="list"
            show-checkbox
            default-expand-all
            node-key="id"
            ref="tree"
            highlight-current
            :props="defaultProps">
          </el-tree>
        </div>
        <div>
          <el-button type="primary" class="starts" icon="el-icon-pie-chart">开始对比</el-button>
        </div>
    </div>
</template>
<script>
  export default {
    data() {
      return {
        list:[],
        defaultProps: {
          children: 'children',
          label: 'name'
        },
      };
    
  },
    methods: {

    },
    mounted(){
        let id=this.$route.query.id;
        this.$http.post("/GetLeftTree",{
            projId:id,
        }).then(result=>{
            this.data = result.data;
            if(this.data.status == "200"){
              this.list = this.data.data;
              console.log(this.list)
            }
        })
    },
  };
</script>
<style lang="stylus" scoped>
    .body-left{
      position: absolute;
      width: 20%;
      top: 0;
      left: 0;
      border:1px solid red;
      overflow-y: auto;
      background-color: #fff;
      float:left;
    }
   .changePro{
       width:10rem;
       font-size:1.5rem;
   }
   .left-top{
       height:5rem;
       border-bottom :1px solid #cccccc;
   }
   .starts{
     width:8rem;
     font-size :1rem;
     margin-top:25rem;
   }
</style>